﻿<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
.questionDetails {
	width: 100%;
	heigh: 100%;
	margin: auto;
	font-family: "微软雅黑";
}

.questionTitle {
	background: #00AA88;
	font-size: 16px;
}

.questionLaywer {
	float: left;
	width: 100%;
}

.questionLaywer p {
	line-height: 14px;
	height: 14px;
}

.questionUser {
	float: right;
	width: 100%;
	text-align: right;
}

.diyi {
	background: #53B0FF;
	height: 80px;
	color: #fff;
}

.diyi_left {
	width: 50%;
	float: left;
}

.diyi_left p {
	height: 20px;
	line-height: 5px;
}

.diyi_left p span {
	padding: 0 10px;
}

.diyi_right {
	width: 50%;
	float: left;
}

.diyi_right p {
	height: 20px;
	line-height: 5px;
	text-align: right;
}

.diyi_right p span {
	padding: 0 10px;
}

.dier {
	background: #D6F1FD;
	line-height: 40px;
	padding: 10px;
	color: #4B4B4B;
	font-weight: 600;
}

.questionLaywer_time {
	color: #C0C0C0;
	margin-left: 22px;
}

.questionLaywer_name {
	color: #000517;
	margin-left: 22px;
}

.questionLaywer_content {
	background: #F7F7F7;
	color: #4F4F4F;
	padding: 25px;
	width: 50%;
	border-radius: 10px;
	margin-left: 52px;
	text-align: left;
	font-size: 14px;
}

.questionUser_time {
	color: #C0C0C0;
	margin-right: 22px;
}

.questionUser_name {
	color: #000517;
	margin-right: 22px;
}

.questionUser_content {
	background: #F7F7F7;
	color: #4F4F4F;
	padding: 25px;
	width: 50%;
	border-radius: 10px;
	margin-right: 52px;
	float: right;
	text-align: left;
	font-size: 14px;
}

.questionReply {
	border: 1px solid #666;
	overflow: hidden;
	padding-bottom: 28px;
}

body {
	padding: 0;
	margin: 0;
	width: 100%;
	heigh: 100%;
}
</style>
<script type="text/javascript"
	src='<c:url value="/js/jquery.js"></c:url>'></script>
<script type="text/javascript">
	var typeData = [ "其他问题", "婚姻家庭", "交通事故", "继承纠纷", "刑事辩护", "劳动仲载", "消费权益",
			"房屋拆迁", "债权债务" ];
</script>
</head>

<body>
	<div class="questionDetails">
		<div class="questionTitle">
			<div class="diyi">
				<div class="diyi_left">
					<p>
						<span>提问人:</span> <span>${CREATEUSER}</span> <span>${CREATETIME}</span>
					</p>
					<!-- <p>
							<span>回答人:</span>
							<span>某某某</span>
							<span>2016-04-25 08:00</span>
						</p> -->
				</div>
				<div class="diyi_right">
					<p>
						<span>问题类型<img src="images/bottom.png"></span>
					</p>
					<p>
						<span id="typeNameId" style="padding-right: 30px;"></span>
					</p>
				</div>
			</div>
			<div class="dier">${CONTENT}</div>
		</div>
		<div class="questionReply">
			<!-- <div class="questionLaywer">
				<p class="questionLaywer_time">2016-15-15 08:00</p>
				<p class="questionLaywer_name">律师某某某回复</p>
				<div class="questionLaywer_content">
					疯啦家乐福卡额付款了啊减肥啊是分厘卡似的分厘卡机是分厘卡三季稻法律萨拉丁放假啦上岛咖啡加拉塞克放假拉山口罗斯福
					疯啦家乐福卡额付款了啊减肥啊是分厘卡似的分厘卡机是分厘卡三季稻法律萨拉丁放假啦上岛咖啡加拉塞克放假拉山口罗斯福</div>
			</div>
			<div class="questionUser">
				<p class="questionUser_time">2016-15-15 08:00</p>
				<p class="questionUser_name">用户某某某回复</p>
				<div class="questionUser_content">
					疯啦家乐福卡额付款了啊减肥啊是分厘卡似的分厘卡机是分厘卡三季稻法律萨拉丁放假啦上 岛咖啡加拉塞克放假拉山口罗斯福
					疯啦家乐福卡额付款了啊减肥啊是分厘卡似的分厘卡机是分厘卡三季稻法律萨拉丁放假啦上岛咖啡加拉塞克放假拉山口罗斯福</div>
			</div> -->
		</div>
	</div>
</body>
<script>
	var id = '${id}';
	var phoneNo = '${phoneNo}';
	var typeId = '${QUESTIONTYPEID}';
	
	$('#typeNameId').html(typeData[typeId]);
	
	
	var url = '<c:url value="/questionMng/detailData/" />' + id;
	$.ajax({
		method : "post",
		url : url,
		dataType : 'json', //加入这个选项即可
		data : {},
		success : function(json) {
			answerContent(json);
		},
		error : function(jqXHR, textStatus, errorThrown) {
			//console.log(textStatus);
		},
	});
	function answerContent(json) {
		var length = json.length;
		var content = '';
		if(length == 0){
			content = '暂无回答。';
		}
		for (var i = 0; i < length; i++) {
			var aData = json[i];
			for (var j = 0, l = json[i].length; j < l; j++) {
				if (aData[j].PINGJIAWHOID == phoneNo || aData[j].CREATEUSER == phoneNo) {
					content += "<div class='questionLaywer'>"
						+ "<p class='questionLaywer_time'>"
						+ aData[j].CREATETIME
						+ "</p>"
						+ "<p class='questionLaywer_name'>";
						if(aData[j].USERNAME){
							content += aData[j].USERNAME;
						}else{
							content += phoneNo;
						}
						content += "</p>"
						+ "<div class='questionLaywer_content'>"
						+ aData[j].CONTENT
						+ "</div>"
						+ "</div>"
				}else{
					content += "<div class='questionUser'>"
						+ "<p class='questionUser_time'>"
						+ aData[j].CREATETIME
						+ "</p>"
						+ "<p class='questionUser_name'>";
						if(aData[j].USERNAME){
							content += aData[j].USERNAME;
						}else{
							content += aData[j].ANWSERWHO;
						}
						content += "</p>"
						+ "<div class='questionUser_content'>"
						+ aData[j].CONTENT
						+ "</div>" + "</div>";
				}	
			}
			if(i != length-1){
				content += "<p style='height:1px;background:#000;clear:both;'></p>";
			}
		}
		$('.questionReply').html(content);
	}
</script>
</html>